<template>

  <swiper>
    <swiper-item v-for="(item,index) in foods"  :key="index">

      <img :src="item.image" alt="" @load="imageLoad">

    </swiper-item>
  </swiper>
</template>

<script>
  import {Swiper, SwiperItem} from '../../../content/swiper'
    export default {
        name: "HomeSwiper",
      data(){
          return{
            isLoad:false
          }
      },
      components:{
        Swiper,
        SwiperItem
      },
      props:{
        foods:{
          type:Array,
          default(){
            return[]
          }
        }
      },
      methods:{
        imageLoad(){
          if (!this.isLoad) {
            this.$emit('swiperImageLoad')
            this.isLoad = true
          }
        }
      }
    }
</script>

<style scoped>

</style>
